<!--
 * @description  :快递档案维护
 * @descriptionDetail:快递档案维护
 * @copyright    : 浙江烟草
 * @author       : dw
 * @create       : 2022-10-09 22:21:21
-->
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar title="快递档案维护">
    </theme-navbar>
    <!-- #endif -->
    <view class="content content-bg ifn-content" style="background-color: white">
      <u-form
        class="u-form-m"
        :label-style="labelStyle"
        :model="baseInfo"
        :error-type="['border-bottom', 'message',]"
        label-width="auto"
        label-position="top"
        :rules="rules"
        ref="uForm"
      >
        <u-form-item label="快递公司名称" prop="expressCompanyName" :required="true">
          <u-input
            v-model="baseInfo.expressCompanyName"
            :disabled="isDisabled"
            placeholder="请输入"
          ></u-input>
        </u-form-item>
        <u-form-item label="登记单位" :required="true">
          <u-input
            :disabled="true"
            placeholder="请选择"
            v-model="baseInfo.orgName"
          >
          </u-input>
        </u-form-item>
        <u-form-item :required="true" prop="point" label="网点名称">
          <u-input
            v-model="baseInfo.point"
            :disabled="isDisabled"
            placeholder="请输入"
          >
          </u-input>
        </u-form-item>
        <u-form-item label="法定代表人">
          <u-input
            v-model="baseInfo.legalPerson"
            placeholder="请输入"
          >
          </u-input>
        </u-form-item>
        <u-form-item
          prop="lonlat"
          :required="true"
          label="经纬度"
        >
          <!-- placeGisX placeGisY -->
          <u-input placeholder="请选择" :disabled="true" v-model="baseInfo.lonlat">
          </u-input>
          <u-icon name="map-fill" :color="$theme.u_type_primary" size="50" @click="getLocation()"></u-icon>
        </u-form-item>
        <u-form-item label="所在地" :border-bottom="false" prop="expressProvCityCountyName" :required="true">
          <view style="display: flex; flex-direction: column;width: 100%;">
            <u-input
              type="select"
              :disabled="true"
              placeholder="所在地选择"
              v-model="baseInfo.expressProvCityCountyName"
              @click=" (nativeNameSelectShow = !isDisabled)"
            ></u-input>
            <u-line :color="$theme.u_border_color" style="style=margin-top: 20rpx"></u-line>
          </view>
        </u-form-item>
        <u-form-item prop="address">
          <u-input :border="true" placeholder="详细地址" :disabled="isDisabled" v-model="baseInfo.address"></u-input>
        </u-form-item>
        <u-form-item label="联系方式" prop="contactPhone" :border-bottom="false">
          <u-input
            v-model="baseInfo.contactPhone"
            type="number"
            placeholder="请输入"
          >
          </u-input>
        </u-form-item>
      </u-form>
    </view>
    <view class="u-form">
      <u-gap :height="$theme.cm_section_top_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
      <fsection :title="title.img" :customStyle="customStyle"></fsection>
    </view>
    <view class="u-form-m pl-10">
      <m-upload
        :uploadParam="fileUploadParam"
        upApiUrl="uploadBase64ForApp"
        :fileList="fileList"
        @on-list-change="changeUpload"
      ></m-upload>
    </view>
    <view class="submit-btns bottom-btns">
      <u-button class="del" type="primary" @click="submit">
        保&nbsp;&nbsp;&nbsp;&nbsp;存
      </u-button>
    </view>

    <u-popup mode="bottom" height="80%" v-model="nativeNameSelectShow">
      <area-select :choiceAll="true" @choose="nativeNameSelectShowComfir"></area-select>
    </u-popup>
    <!-- 组织机构选择 -->
    <u-popup mode="bottom" height="80%" v-model="orgSelectShow">
      <org-select :cleanParentOrg="true" :isHybrid="true" limitNodeType="all" treeType="zm-comp" @choose="handlerChooseOrg"></org-select>
    </u-popup>
  </view>
</template>

<script>
import areaSelect from "@/components/area-select.vue";
import OrgSelect from "@/components/org-select.vue";
import intelligenceservice from "@/service/intelligence/intelligence.service";
import commonService from '@/service/common/common.service.js';
import {uuid,} from '@/common/util.js';
import MUpload from "@/components/m-upload.vue";
import fsection from "@/components/form-section.vue";
export default {
  components: {
    areaSelect,
    OrgSelect,
    MUpload,
    fsection,
  },
  data() {
    return {
      customStyle:{
        padding:"20rpx 32rpx",
      },
      fileUploadParam:{
        fiGroupCode:this.$FILE_GROUP_TYPE.k_transport_attr,
        bizId:"",
      },
      rules:{
        expressCompanyName: [{
          required: true,
          message: '请输入快递公司名称',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },],
        lonlat: [{
          required: true,
          message: '请选择经纬度',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },],
        expressProvCityCountyName: [{
          required: true,
          message: '请选择所在地',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },],
        status: [{
          required: true,
          message: '请选择状态',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },],
        address: [{
          required: true,
          message: '请输入地址',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },],
        point: [{
          required: true,
          message: '请输入网点',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },],
        contactPhone: [{
          validator: (rule, value, callback) => {
            if(this.$u.test.isEmpty(value)){
              return true;
            }{
              return this.$u.test.mobile(value) || this.$u.test.tel(value);
            }
          },
          message: '联系电话格式不正确!',
          // 可以单个或者同时写两个触发验证方式
          trigger: ['change', 'blur',],
        },],
      },
      baseInfo: {
        expressCompanyName:"",
        orgUuid:"",
        orgName:"",
        address: "",
        cityCode: "",
        contactPhone: "",
        countyCode: "",
        expressProvCityCounty: [],
        expressProvCityCountyName:"",
        legalPerson: "",
        lonlat: "",
        menuCode: "",
        point: "",
        provCode: "",
        uuid:"",
        longitude:'',
        latitude:'',
      },
      labelStyle: {
        fontWeight: 400,
        color: this.$theme.u_main_color,
        fontSize: '.75rem',
      },
      iconstlye: {
        'fontSize': '40rpx',
        'color': this.$theme.u_type_primary,
      },
      title:{
        img:"图片信息",
        connectMsg:"快递档案维护",

      },
      from:"add",
      orgSelectShow: false,
      nativeNameSelectShow: false,
      fileList:[],
      user: this.$storage.get(this.$rp.common.USER),
      isDisabled:false,
    }
  },
  onLoad(opt) {
    this.from = opt.from;
    if(this.from === "edit"){
      this.isDisabled = false;
      this.baseInfo = this.getRouteParam();
      if (!this.$u.test.isEmpty(this.baseInfo.longitude)) {
        this.baseInfo.lonlat = `${this.baseInfo.longitude},${this.baseInfo.latitude}`;
      } else {
        this.baseInfo.lonlat = "";
      }
      // if (this.$u.test.isEmpty(this.baseInfo.cityCode) && this.$u.test.isEmpty(this.baseInfo.countyCode)) {
      //   this.baseInfo.expressProvCityCountyName = this.baseInfo.provCodeName;
      // } else if (this.$u.test.isEmpty(this.baseInfo.countyCode)) {
      //   this.baseInfo.expressProvCityCountyName = this.baseInfo.provCodeName + "/" + this.baseInfo.cityCodeName;
      // } else if (!this.$u.test.isEmpty(this.baseInfo.countyCode)){
      //   this.baseInfo.expressProvCityCountyName = this.baseInfo.provCodeName + "/" + this.baseInfo.cityCodeName + "/" + this.baseInfo.countyCodeName;
      // } else if (!this.$u.test.isEmpty(this.baseInfo.provCode)){
      //   this.baseInfo.expressProvCityCountyName = "";
      // }
      this.baseInfo.expressProvCityCountyName =
					this.$store.state.areaObj[this.baseInfo.countyCode] ||
					this.$store.state.areaObj[this.baseInfo.cityCode] ||
					this.$store.state.areaObj[this.baseInfo.provCode] ||
					'';
      this.fileUploadParam.bizId = this.baseInfo.uuid;
      let params = {
        bizId: this.baseInfo.uuid,
        group: this.$FILE_GROUP_TYPE.k_transport_attr,
        menuCode: null,
      };
      intelligenceservice.findFilesByBizIdAndGroup(params).then((res) => {
        if (res.success) {
          this.fileList = res.data;
        }
      });
    } else {
      this.baseInfo.uuid = uuid();
      this.fileUploadParam.bizId = this.baseInfo.uuid;
      if (this.user.orgLevel === 1) {
        this.baseInfo.orgName = this.user.provOrgName;
        this.baseInfo.orgUuid = this.user.provOrgUuid;
      } else {
        this.baseInfo.orgName = this.user.townOrgName;
        this.baseInfo.orgUuid = this.user.townOrgUuid;
      }
    }
  },
  onReady() {
    this.$refs.uForm.setRules(this.rules);
    this.getListViewTop();
  },
  mounted() {},
  methods: {
    getListViewTop() {
      this.$u.getRect('.case-search-lay').then((res) => {
        this.listViewTop = this.$u.sys().statusBarHeight + res.top + res.height + 'px';
      });
      this.$u.getRect('.submit-btns').then((res) => {
        this.bottomOffset = this.$u.sys().screenHeight - res.top + 'px';
      });
    },
    // 上传/删除图片事件
    changeUpload(list, key) {
      if (list.length > 0) {
        this.fileList = [...list,];
      } else {
        this.fileList = [];
      }
    },
    updateBackState(param) {
      if (param.pos) {
        //  定位
        // 回显经纬度
        this.baseInfo.longitude = param.pos.longitude;
        this.baseInfo.latitude = param.pos.latitude;
        this.baseInfo.lonlat = `${param.pos.longitude},${param.pos.latitude}`;
        let addressName = param.pos.regeocode.addressComponent;
        console.log('===' + JSON.stringify(param.pos));
        let area = commonService.getLocalName(addressName.province, addressName.city, addressName.district);
        if (this.$modal.isMuniCity(area.proCode)) {
          this.baseInfo.expressProvCityCountyName = area.admdivName + area.areaName;
        } else {
          this.baseInfo.expressProvCityCountyName = area.proName + area.admdivName + area.areaName;
        }
        this.baseInfo.provCode = area.proCode;
        this.baseInfo.cityCode = area.admdivCode;
        this.baseInfo.countyCode = area.countryCode;
      }
    },
    getLocation() {
      if (this.isDisabled) return;
      this.setRouteParam({ disable: false, step: 'start', });
      this.$u.route('pages/commonPage/modifyLocationMap');
    },
    handlerChooseOrg(orgs) {
      this.baseInfo.orgUuid = orgs[0].id;
      this.baseInfo.orgName = orgs[0].name;
      this.orgSelectShow = false;
    },
    nativeNameSelectShowComfir(areas) {
      if (this.$u.test.isEmpty(areas[0].admdivCode) && this.$u.test.isEmpty(areas[0].countryCode)) {
        this.baseInfo.expressProvCityCountyName = areas[0].proName;
      } else if (this.$u.test.isEmpty(areas[0].countryCode)) {
        this.baseInfo.expressProvCityCountyName = areas[0].proName + '/' + areas[0].admdivName;
      } else if (!this.$u.test.isEmpty(areas[0].countryCode)) {
        this.baseInfo.expressProvCityCountyName = areas[0].proName + '/' + areas[0].admdivName + '/' + areas[0].countryName;
      }
      this.baseInfo.provCode = areas[0].proCode;
      this.baseInfo.cityCode = areas[0].admdivCode;
      this.baseInfo.countyCode = areas[0].countryCode;
      this.baseInfo.expressProvCityCounty = areas;
      this.nativeNameSelectShow = false;
    },
    submit() {
      this.$refs.uForm.validate((valid) => {
        if (valid) {
          let params = this.baseInfo;
          this.$modal.showLoading('保存中...');
          intelligenceservice
            .saveexpressInfo(params)
            .then((res) => {
              this.$modal.hideLoading();
              if (res.success) {
                this.baseInfo = res.data;
                this.backPrev({
                  paramKey: 'refresh',
                  param: true,
                });
              } else {
                this.$u.toast(res.msg);
              }
            })
            .catch((err) => {
              this.$modal.hideLoading();
              console.log(err);
              this.$u.toast(err.msg);
            });
        } else {
          console.log('验证失败');
        }
      });
    },
    close() {
      this.$u.route('pages/intelligence/intelligenceTransportList');
    },
  },
};
</script>

<style scoped lang="scss">
	@import './add.scss';
</style>
